<!-- 我的提现 -->
<template>
	<view class="tn-p">

		<view v-for="(item, index) in list" :key="index" class="tn-radius tn-border tn-mt tn-p tn-red-light_border">
			<view class="flex-x flex-x-between">
				<view class="tn-text-sm">{{ item.code }}</view>
				<view>
					<view class="tn-text-sm tn-blue_text" v-if="Number(item.amount) > 0">
						收入 {{ Math.abs(Number(item.amount)) }} 元
					</view>
					<view class="tn-text-sm tn-red_text" v-else>
						支出 {{ Math.abs(Number(item.amount)) }} 元
					</view>
				</view>
			</view>
			<view class="tn-border-top tn-border tn-red-light_border tn-mt-xs"></view>
			<view class="tn-mt-xs">
				<view class="tn-mt-xs flex-x">
					<view style="white-space:nowrap;">交易名称：</view>
					<text class="tn-text-sm">{{ item.name }}</text>
				</view>
				<view class="tn-mt-xs flex-x">
					<view style="white-space:nowrap;">交易描述：</view>
					<text class="tn-text-sm">{{ item.remark }}</text>
				</view>
			</view>
			<view class="tn-mt-xs">
				交易状态：
				<text class="tn-text-sm tn-red_text tn-text-bold" v-if="item.cancel">已取消</text>
				<text class="tn-text-sm tn-blue_text tn-text-bold" v-else-if="item.unlock">已生效</text>
				<text class="tn-text-sm tn-red_text tn-text-bold" v-else>锁定中</text>
			</view>
			<view class="ta-desc-color tn-text-xs tn-mt-sm tn-text-right">
				{{ item.create_time }}
			</view>
		</view>

		<view v-if="list.length < 1" style="padding:300rpx 0">
			<uv-empty mode="list" text="~暂无数据~" icon="/static/imgs/empty/car.png" />
			<view class="tn-mt-xl flex-center">
				<uv-button @click="goto.back()" shape="circle" text="上一页" />
			</view>
		</view>

		<view v-else class="tn-mt">
			<uv-load-more :status="more" @loadmore="loadData" />
		</view>

	</view>
</template>

<script lang="ts">

import { defineComponent } from 'vue'
import { TaUseAccount, TaDataUser } from '@/utils'

export default defineComponent({
	setup() {
		return TaUseAccount()
	},
	data() {
		return {
			page: <number>0,
			more: <any>'loadmore',
			list: <any[]>[]
		}
	},
	onShow() {
		this.loadData();
	},
	onReachBottom() {
		if (this.more === 'loadmore') {
			this.loadData()
		}
	},
	onPullDownRefresh() {
		this.loadData(true);
		setTimeout(() => uni.stopPullDownRefresh(), 1000)
	},
	methods: {
		// 加载地址
		loadData(force: boolean = false) {
			if (force) {
				this.page = <number>0
				this.list = <any[]>[]
			}
			this.more = 'loading'
			TaDataUser.my.transfers({ page: ++this.page }).then((ret: any) => {
				if (ret.data.list.length > 0) {
					this.more = 'loadmore'
					this.page = ret.data.page.current || 0
					this.list = this.list.concat(ret.data.list)
				}
				if (ret.data.page.total <= this.list.length) {
					this.more = 'nomore'
				} else if (this.list.length <= 0) {
					this.more = 'empty'
				}
			})
		}
	}
})
</script>